<!--
    This Source Code Form is subject to the terms of the Mozilla Public
    License, v. 2.0. If a copy of the MPL was not distributed with this
    file, You can obtain one at http://mozilla.org/MPL/2.0/.
-->

<!--
    Copyright 2019 Joyent, Inc.
-->

<div class="row">
    <div class="col-md-8 col-md-offset-1">
        <div class="page-header">
            {{#if uuid}}
            {{#if changeOwnerMode}}
            <h2>Change Package Settings for {{name}} {{version}}</h2>
            {{/if}}
            {{#if newVersionMode}}
            <h2>Create New Version of {{name}} {{version}}</h2>
            {{/if}}
            {{else}}
            <h2>Create a new Package</h2>
            {{/if}}
        </div>
    </div>
</div>

<div class="row">
  <div class="col-md-9 col-md-offset-1">
    <form class="form-horizontal" role="form">
      <div class="error-alert-container"></div>

      {{#unless changeOwnerMode}}
      <div class="form-group">
        <p class="help-block col-md-offset-1">
          Name and version of the package is used to uniquely identify a package. Once a package with a specific version has been created, the properties making up the package cannot be modified. A new version must be created with the new properties.
        </p>
      </div>

      <div class="form-group">
        <label class="control-label col-sm-4" for="package-name">Name</label>
        <div class="controls col-sm-8">
          <input type="text"
              value="{{name}}"
              id="package-name"
              name="name"
              class="form-control col-sm-8"
              {{#if newVersionMode}}
              readonly
              {{/if}}
          placeholder="Name of the package">
        </div>
      </div>
      {{/unless}}

      <div class="form-group">
        <label class="control-label col-sm-4" for="package-name">Description</label>
        <div class="controls col-sm-8">
          <textarea class="form-control" rows="3" class="span4" name="description">{{description}}</textarea>
        </div>
      </div>

      <div class="form-group">
        <label class="control-label col-sm-4" for="package-group">Group</label>
        <div class="col-sm-6">
          <input type="text"
              name="group"
              class="form-control"
              value="{{group}}"
              id="package-group"
              placeholder="Package Group">
          <p class="help-block">For similar packages grouping</p>
        </div>
      </div>

      {{#unless changeOwnerMode}}
      <div class="form-group">
        <label class="control-label col-sm-4" for="package-version">Version</label>
        <div class="controls col-sm-3">

          {{#if newVersionMode}}
          <p class="original-version">
            Original Version {{version}} <br/>
            Please specify a new version.
          </p>
          {{/if}}
            <input type="text"
          {{#unless newVersionMode}}
            value="{{version}}"
          {{/unless}}
            id="package-version"
            class="form-control"
            name="version" placeholder="Version">
        </div>
      </div>
      {{/unless}}

      <div class="form-group package-owners">
        <label class="control-label col-sm-4" for="package-owner">Owners</label>
        <div class="col-sm-6">
            {{#unless owner_uuids.length}}
            <input type="text"
                 class="form-control input-xl package-owner"
                 name="owner_uuids[]"
                 placeholder="Search by login, email, uuid">
            {{else}}

            {{#each owner_uuids}}
              <input type="text"
                  value="{{this}}"
                  class="form-control package-owner"
                  name="owner_uuids[]"
                  placeholder="Search by login, email, uuid">
            {{/each}}
            {{/unless}}
        </div>
        <div class="clearfix"></div>
        <div class="col-sm-6 col-sm-offset-4">
            <a class="add-owner-entry"><i class="fa fa-plus"></i> Add Another Owner</a>
        </div>
      </div>

      {{#unless changeOwnerMode}}
      <legend>CPU &amp; Memory</legend>
      <div class="form-group">
        <label class="control-label col-sm-4" for="package-memory">Memory</label>
          <div class=" col-sm-5">
            <div class="input-group">
                <input type="number" class="form-control" id="package-memory"
                    name="max_physical_memory" min="64"
                    value="{{max_physical_memory}}" placeholder="memory">
                <span class="input-group-addon">MB</span>
            </div>
         </div>
      </div>

      <div class="form-group">
        <label class="control-label col-sm-4" for="package-memory">Swap</label>
        <div class="col-sm-5">
          <div class="input-group">
            <input type="number" class="form-control" id="package-swap"
                name="max_swap" value="{{max_swap}}" min="128" placeholder="swap">
            <span class="input-group-addon">MB</span>
          </div>
          <p class="help-block">Must be at least twice the size of memory</p>
        </div>
      </div>

      <div class="form-group">
        <label class="control-label col-sm-4" for="package-vcpus">Number of vCPUs</label>
        <div class="col-sm-5">
          <input type="number"
              value="{{vcpus}}"
              class="form-control"
              id="package-vcpus"
              name="vcpus" placeholder="cpus">
          <p class="help-block">Applies to HVMs only.
            <a data-toggle="tooltip" data-placement="bottom" data-trigger="hover"
              title="Number of virtual CPUs presented to the guest OS. Required when creating a HVM.">
              What is this?</a>
          </p>
        </div>
      </div>

      <div class="form-group">
        <label class="control-label col-sm-4" for="package-cap-cpu">CPU Cap</label>
        <div class="col-sm-5">
          <div class="input-group">
            <input type="number"
                value="{{cpu_cap}}"
                class="form-control"
                id="package-cpu-cap"
                name="cpu_cap"
                min="20" max="10000" placeholder="cpu cap">
            <span class="input-group-addon">%</span>
          </div>
          <p class="help-block">Minimum: 20%
            <a data-toggle="tooltip" data-placement="bottom" data-trigger="hover"
              title="Upper bound for the computational time the instance can use. Applies to all instance types. For example, 200% would give the instance up to 2 vCPUs worth of computational time. To account for CPU time taken by system tasks, set this higher than the number of vCPUs the instance requires.">
              What is this?</a>
          </p>
        </div>
      </div>

      <div class="form-group">
        <label class="control-label col-sm-4" for="package-vcpus">Max Threads</label>
        <div class="col-sm-5">
          <input type="number"
              value="{{max_lwps}}"
              class="form-control" id="package-max-processes"
              name="max_lwps" min="250" placeholder="threads">
        </div>
      </div>

      <legend>Disk</legend>
        <div class="form-group">
          <label class="control-label col-sm-4" for="package-quota">Disk Quota</label>
            <div class="col-sm-5">
                <div class="input-group">
                  <input type="number"
                      value="{{quota}}"
                      class="form-control" name="quota" id="package-quota"
                      min="1"
                      placeholder="disk quota">
                  <span class="input-group-addon">MB</span>
                </div>
                <p class="help-block">Must be a multiple of 1024</p>
            </div>
        </div>

        <div class="form-group">
          <label class="control-label col-sm-4" for="package-io-prioirty">IO Priority</label>
            <div class="col-sm-5">
              <input type="number"
                  name="zfs_io_priority"
                  class="form-control"
                  value="{{zfs_io_priority}}"
                  id="package-io-priority"
                  min="1"
                  max="16383"
                  placeholder="Disk IO Priority">
              <p class="help-block">1 for minimum, 16383 for maximum</p>
            </div>
        </div>

        <legend>Optional Settings</legend>
        <div class="form-group">
            <label class="control-label col-sm-4" for="package-brand">Brand</label>
            <div class="col-md-7">
                <select class="form-control" name="brand">
                    <option></option>
                    <option value="bhyve" {{#ifeq brand "bhyve"}}selected{{/ifeq}}>bhyve</option>
                    <option value="joyent" {{#ifeq brand "joyent"}}selected{{/ifeq}}>joyent</option>
                    <option value="joyent-minimal"> {{#ifeq brand "joyent-minimal"}}selected{{/ifeq}}joyent-minimal</option>
                    <option value="kvm"> {{#ifeq brand "kvm"}}selected{{/ifeq}}kvm</option>
                    <option value="lx" {{#ifeq brand "lx"}}selected{{/ifeq}}>lx</option>
                </select>
            </div>
        </div>


      <div class="form-group package-disks">
        <label class="control-label col-sm-4" for="package-disk">Disks</label>
        <div class="col-sm-6">
            {{#unless disks.length}}
            <input type="text"
                 class="form-control input-xl package-disk"
                 name="disks[]"
                 placeholder="Disk size in MiB">
            {{else}}

            {{#each disks}}
              <input type="text"
                  value="{{size}}"
                  class="form-control package-disk"
                  name="disks[]"
                  placeholder="Disk size in MiB">
            {{/each}}
            {{/unless}}
        </div>
        <div class="clearfix"></div>
        <div class="col-sm-6 col-sm-offset-4">
            <a class="add-disk-entry"><i class="fa fa-plus"></i> Add Another Disk (Bhyve only)</a>
        </div>
      </div>

      {{/unless}}

      <div class="form-group">
        <div class="col-sm-offset-4 col-sm-8">
          <div class="checkbox">
            <label><input type="checkbox" {{#if active}}checked{{/if}} name="active"> Activate Package</label>
          </div>
          <div class="checkbox">
            <label><input type="checkbox" {{#if default}}checked{{/if}} name="default"> Make this the Default Package</label>
          </div>
          {{#unless changeOwnerMode}}
          <div class="checkbox">
            <label><input type="checkbox" {{#if flexible_disk}}checked{{/if}} name="flexible_disk" {{#ifnoteq brand "bhyve"}}disabled{{/ifnoteq}}> Flexible Disk (Bhyve only)</label>
          </div>
          {{/unless}}
        </div>
      </div>

      <div class="form-group">
        <div class="col-sm-offset-4 col-sm-8">
          <button type="submit" class="btn btn-primary">
            {{#if uuid}} Save Package {{else}} Create Package {{/if}}
          </button>
          <button type="cancel" class="btn btn-default">Cancel</button>
        </div>
      </div>
    </form>
  </div>
</div>
